<template>
  <div>

    <span class="cardHeader">热门学者</span>
    <div v-for="(item) in scholars" :key="item.authorId" @click="jumpToAuthorDetail(item)">
      <p class="scholars">{{item.name}}</p>
      <hr/>
    </div>


  </div>
</template>

<script>
import axios from "@/utils/MyAxios";
import qs from "qs";

export default {
  name: "IndexScholars",
  data() {
    return {
      scholars: [],
      constScholars: [
        {
          authorId: 1,
          name: 'au 1',
        },
        {
          authorId: 2,
          name: 'au 2',
        },

      ],
    }
  },
  mounted() {
    this.getScholarFocus()
  },

  methods: {

    getScholarFocus() {
      const data = {}
      axios.post('/api/index/authorFocus', qs.stringify(data)).then(res => {
        console.log(res)
        if (res.data.code === 0) {
          this.scholars = res.data.data
        }
        else {
          console.log('获取科研门户热点ERROR')
        }
      })
    },

    jumpToAuthorDetail(author) {
      const { href } = this.$router.resolve({
        path: '/portal',
        query: {
          authorId: author.authorId
        }
      })
      window.open(href, '_blank')
    },
  },
}
</script>

<style scoped>

.scholars {
  font-family: "Apple SD Gothic Neo",serif;
  font-size: medium;
  font-weight: bold;
  color: #addcf5;

  cursor: pointer;
}

.cardHeader {
  margin-top: 1%;
  font-family: serif;
  font-size: large;
  color: white;

}

</style>